import React from 'react';
import ReactDOM from 'react-dom';

class VisitButton extends React.Component {
  handleClick = (event: React.MouseEvent) => {
    console.log(event.currentTarget.id); //currentTarget 才是原生的event.target属性 而这里的event.target属性是react包装后的
  };

  //传入一个HTMLButtonElement后,event.currentTarget能点更多的东西出来
  //第二个参数可以传入原生的 MouseEvent 接口
  /*handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
      console.log(event.currentTarget.id);
  };*/

  render() {
    return (
      //<button onClick={this.handleClick.bind(this)}>
      <button id="visit-btn" onClick={this.handleClick}>
        点我吧
      </button>
    )
  }
}

ReactDOM.render(<VisitButton/>, document.getElementById('root'));
